import React from 'react';
import { Steps, Card, Table } from 'antd';

const Step = Steps.Step;


class MyStep extends React.Component {
  constructor(...args) {
    super(...args);
  }
  render() {
    const { title, msg } = this.props || ' ';
    const arr = msg || [];
    let i = 0;
    const myarr = arr.map((item) => {
      if (item.day == 0)item.day = '日';
      switch (item.time) {
        case '06月01日' : item.date = '儿童节';
          break;
        case '07月02日' : item.date = '建党节';
          break;
        case '08月01日' : item.date = '建军节';
          break;
        case '09月15日' : item.date = '中元节';
          break;
        case '08月28日' : item.date = '七夕';
          break;
        case '09月10日' : item.date = '教师节';
          break;
        case '10月04日' : item.date = '中秋节';
          break;
        case '10月28日' : item.date = '重阳节';
          break;
        case '11月1日' : item.date = '万圣节';
          break;
        case '11月11日' : item.date = '光棍节';
          break;
        case '12月25日' : item.date = '万圣节';
          break;
        default:item.date = '';
      }
      return (
        <div style={{ marginBottom: '0px', width: 280 }} key={i++}>
          <Card bodyStyle={{ background: '#3E6588', color: '#fff', padding: 8 }}>
            <div style={{ display: 'flex', justifyContent: 'flex-start' }}>
              <div style={{ textAlign: 'center', marginRight: '20px', marginLeft: '10px' }}>
                <p style={{ width: '50px' }}>{item.time}</p>
                <p style={{ width: '50px' }}>星期{item.day}</p>
                <p style={{ width: '50px', color: 'red' }}>{item.date}</p>
                <a style={{ color: '#fff' }} href={item.url} target="view_window">阅读原文</a>
              </div>
              <div style={{ flex: '9', paddingLeft: '0px', fontSize: '14px', overflow: 'hidden' }}>
                <h3 style={{ marginBottom: '5px', textOverflow: 'ellipsis', overflow: 'hidden', width: '70%', whiteSpace: 'nowrap', color: '#fff' }}>{item.title}</h3>
                <p>阅读人数:{item.int_page_read_user}<span style={{ marginLeft: '10px' }}>阅读次数:{item.int_page_read_count}</span></p>
                <p>收藏人数:{item.add_to_fav_user}<span style={{ marginLeft: '10px' }}>收藏次数:{item.add_to_fav_count}</span></p>
                <p>分享人数:{item.share_user}<span style={{ marginLeft: '10px' }}>分享次数:{item.share_count}</span></p>

              </div>
            </div>
          </Card>
        </div>
      );
    });

    return (
      <div>
        {myarr}
      </div>
    );
  }

}

MyStep.propTypes = {
};

export default MyStep;
